﻿@model IList<ProductOverviewModel>

@using Nop.Web.Models.Catalog;

@if (Model.Count > 0)
{
<div id="featured-products_block_center" class="block products_block grid_19 omega">
    <div class="featured-products-content">
        <h4 class="title_block">@T("HomePage.Products")</h4>
        <div class="block_content">
            <div style="display: block; text-align: start; float: none; position: relative; top: auto; right: auto; bottom: auto; left: auto; z-index: auto; width: 928px; height: 234px; margin: 0px; overflow: hidden;" class="caroufredsel_wrapper">
                <ul style="text-align: left; float: none; position: absolute; top: 0px; right: auto; bottom: auto; left: 0px; margin: 0px; width: 4640px; height: 234px;" class="ul_home_fearture">
                     @foreach (var item in Model)
                     {
                         @Html.Partial("_ProductBox", item)
                     }
                </ul>
            </div>
            <a style="display: block;" id="prev_home_featured" class="prev btn" href="#">&lt;</a>
            <a style="display: block;" id="next_home_featured" class="next btn" href="#">&gt;</a>
        </div>
    </div>
</div>
}
<script type="text/javascript">
    $(window).load(function () {
        $("ul.ul_home_fearture").carouFredSel({
            auto: false,
            responsive: true,
            width: '100%',
            prev: '#prev_home_featured',
            next: '#next_home_featured',
            swipe: {
                onTouch: true
            },
            items: {
                width: 250,
                height: 'variable',
                visible: {
                    min: 1,
                    max: 5
                }
            },
            scroll: {
                items: 2,       //  The number of items scrolled.
                direction: 'left',    //  The direction of the transition.
                duration: 500   //  The duration of the transition.
            }

        });
    });
</script>